import 'package:flutter/material.dart';

class CreditVCard extends StatelessWidget {
  final CreditCardViewModel data;
  final int index;
  const CreditVCard({Key key, this.data, this.index}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    int cardBgIndex = index % 4;
    return Container(
      height: 180,
      margin: EdgeInsets.fromLTRB(16, 16, 16, 0),
      padding: EdgeInsets.only(left: 20, top: 20),
      decoration: BoxDecoration(
        image: DecorationImage(
            image: AssetImage('assets/card/card_bg_$cardBgIndex.png'),
            fit: BoxFit.cover),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Stack(
        children: <Widget>[
          Positioned(
            right: -100,
            bottom: -100,
            child: Image.asset(
              this.data.bankLogoUrl,
              width: 250,
              height: 250,
              color: Colors.white10,
            ),
          ),
          Positioned(
            left: 0,
            top: 0,
            right: 0,
            bottom: 0,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    CircleAvatar(
                      radius: 25,
                      backgroundColor: Colors.white,
                      child: Image.asset(
                        this.data.bankLogoUrl,
                        width: 36,
                        height: 36,
                        fit: BoxFit.scaleDown,
                      ),
                    ),
                    Padding(padding: EdgeInsets.only(left: 15)),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Container(
                          width: 240,
                          child: Text(
                            this.data.nickName,
                            overflow: TextOverflow.ellipsis,
                            style: TextStyle(
                              fontSize: 24,
                              fontWeight: FontWeight.bold,
                              color: Colors.white,
                            ),
                          ),
                        ),
                        Text(
                          this.data.budgetType,
                          style: TextStyle(
                            fontSize: 14,
                            color: Color.fromARGB(200, 255, 255, 255),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
                Padding(
                  padding: EdgeInsets.only(left: 65, top: 20),
                  child: Text(
                    this.data.cardId,
                    style: TextStyle(
                      fontSize: 16,
                      fontFamily: 'Farrington',
                      letterSpacing: 3,
                      color: Colors.white,
                    ),
                  ),
                ),
                Padding(
                  padding: EdgeInsets.only(left: 65, top: 15),
                  child: Text(
                    this.data.cardOwner,
                    style: TextStyle(
                        fontSize: 13,
                        color: Colors.white,
                        fontWeight: FontWeight.bold),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class CreditCardViewModel {
  /// 银行Logo
  final String bankLogoUrl;

  /// 卡片颜色
  List<Color> cardColors;

  /// 有效期
  final String validDate;

  final String nickName;
  final String cardOwner;
  final String vendor;

  final String budget;
  final String lastChargedOn;
  final String type;

  final String cardId;
  final String id;

  final String budgetId;
  final String status;
  final String budgetType;
  final String expiration;
  final String availableToSpent;
  final String spent;
  final String assigned;
  final String cardLimit;
  final String cvc;

  final String address;
  final String city;
  final String state;

  @override
  String toString() {
    return this.assigned;
  }

  CreditCardViewModel(
      this.address,
      this.city,
      this.state,
      this.bankLogoUrl,
      this.cardLimit,
      this.cvc,
      this.spent,
      this.assigned,
      // this.cardColors,
      this.validDate,
      this.nickName,
      this.cardOwner,
      this.vendor,
      this.budget,
      this.lastChargedOn,
      this.type,
      this.cardId,
      this.id,
      this.budgetId,
      this.status,
      this.budgetType,
      this.expiration,
      this.availableToSpent);

  CreditCardViewModel.fromJson(
    Map<String, dynamic> json,
  )   : nickName = json['nickName'] ?? '',
        cardOwner = json['cardOwner'] ?? '',
        vendor = json['vendor'] ?? '',
        budget = json['budget'] ?? '',
        lastChargedOn = json['lastChargedOn'] ?? '',
        type = json['type'] ?? '',
        cardId = json['cardId'] ?? '',
        cvc = json['cvc'] ?? '',
        cardLimit = json['cardLimit'] ?? '',
        id = json['id'] ?? '',
        budgetId = json['budgetId'] ?? '',
        expiration = json['expiration'] ?? '',
        status = json['status'] ?? '',
        budgetType = json['budgetType'] ?? '',
        bankLogoUrl = 'assets/pics/bank_zs11.png',
        cardColors = [Color(0xFFF17B68), Color(0xFFE95F66)],
        availableToSpent = (json['availableToSpent'] ?? '0.00').toString(),
        spent = (json['spent'] ?? '').toString(),
        assigned = (json['assigned'] ?? '').toString(),
        address = json['address'] ?? '',
        city = json['city'] ?? '',
        state = json['state'] ?? '',
        validDate = json['cvc'] ?? '';
}

class PhysicalCardModel {
  final String virtualId;
  final String cardId;

  final String address;
  final String city;
  final String state;
  final String cardHolder;
  final String cvc;
  final String expiration;
  final String cardLimit;
  String bankLogoUrl;

  PhysicalCardModel(this.virtualId, this.address, this.city, this.state,
      this.cardHolder, this.cvc, this.expiration, this.cardLimit, this.cardId);

  PhysicalCardModel.fromJson(Map<String, dynamic> json)
      : virtualId = json['virtualId'] ?? '',
        cardId = json['cardId'] ?? '',
        address = json['address'] ?? '',
        city = json['city'] ?? '',
        state = json['state'] ?? '',
        cardHolder = json['cardHolder'] ?? '',
        cvc = json['cvc'] ?? '',
        expiration = json['expiration'] ?? '',
        bankLogoUrl = 'assets/pics/bank_zs11.png',
        cardLimit = json['cardLimit'] ?? '';
}
